import React, { Component } from 'react'
import { Link, Route } from 'react-router-dom'
import Welcome from './Welcome'
import User from './User'

export default class Index extends Component {
  render() {
    // 当前组件的请求uri地址(父组件路由uri)
    let pathname = this.props.match.path


    return (
      <>
        <header>
          <h3>后台管理操作</h3>
        </header>

        <div>
          <ul>
            <li><Link to={`${pathname}/index`}>后台首页</Link></li>
            <li><Link to={`${pathname}/user`}>用户列表</Link></li>
          </ul>
          <div>
            {/* Route写在admin组件内，admin组件通过Route来进行渲染 此时 多层路由 */}
            <Route path={`${pathname}/index`} component={Welcome} />
            <Route path={`${pathname}/user`} component={User} />
          </div>
        </div>



        <footer>底部声明</footer>
      </>
    )
  }
}
